<template>
  <view class="back-com-page"
    ><view class="back-box" :style="data.backStyle" @click="back">
      <view class="iconfont icon-back"></view> </view
  ></view>
</template>
<script setup lang="ts">
import { reactive, onMounted, getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
const data = reactive({
  backStyle: {},
});
onMounted(() => {
  handleBackBox();
});
const handleBackBox = () => {
  // #ifdef MP-WEIXIN
  const systemMenuBtn = proxy.$config.systemMenuBtn();
  data.backStyle = {
    top: `${systemMenuBtn.top}px`,
  };
  // #endif
};
const back = () => {
  uni.navigateBack({
    fail: () => {
      proxy.$utils.goHerf("/pages/home/index/index", "redirect");
    },
  });
};
</script>
<style lang="scss" scoped>
@import url("@/static/css/theme.scss");
.back-com-page {
  .back-box {
    position: fixed;
    left: 30rpx;
    width: 50rpx;
    height: 50rpx;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 7;
    background: rgba($color: #fff, $alpha: 0.7);
    border-radius: 50%;
    .icon-back {
      font-size: 28rpx;
      color: #000;
    }
  }
}
</style>
